<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<%--JSP头部复用--%>
<jsp:include page="common/head.jsp" flush="true"></jsp:include>
<main role="main" class="col-md-9 ml-sm-auto col-lg-10 px-4">
    <div class="d-flex justify-content-between flex-wrap flex-md-nowrap align-items-center pt-3 pb-2 mb-3 border-bottom">
        <h1 class="h2">订单信息</h1>
        <div class="btn-toolbar mb-2 mb-md-0">
            <nav class="navbar navbar-expand-lg navbar-light">
                <div class="collapse navbar-collapse" id="navbarSupportedContent">
                    <form class="form-inline my-2 my-lg-0" method="post" action="#" style="width:900px;">
                        <div class="form-group col-md-4" style="padding-left:150px;">
                            <select id="queryProName" name="queryProName" class="form-control">
                                <c:if test="${providerName != null}">
                                    <option value="">--选择供应商--</option>
                                    <c:forEach var="proName" items="${providerName}">
                                        <option <c:if test="${proName == queryProName}">selected="selected"</c:if> value="${proName}">${proName}</option>
                                    </c:forEach>
                                </c:if>
                            </select>
                        </div>
                        <div style="padding-left: 135px;margin-right: 5px;">
                            <select id="queryIsPayment" name="queryIsPayment" class="form-control">
                                <option value="">--是否支付--</option>
                                <option <c:if test="${1 == isPayment}">selected="selected"</c:if> value="1">未支付</option>
                                <option <c:if test="${2 == isPayment}">selected="selected"</c:if> value="2">已支付</option>
                            </select>
                        </div>
                        <%--                                第一次当前页肯定为一--%>
                        <input type="hidden" name="pageIndex" value="1"/>
                        <input class="form-control mr-sm-2" id="queryProductName" name="queryProductName" type="text" placeholder="请输入商品名称" value="${queryProductName}">
                        <button class="btn btn-outline-primary" type="submit"><img src="static/images/SVG/搜索.svg"></button>
                    </form>
                    <a type="button" class="btn btn-success" href="/reachBill?billId=0">添加订单</a>
                </div>
            </nav>
        </div>
    </div>
    <div class="table-responsive">
        <c:if test="${sessionScope.msg1 != null}">
            <div class="alert alert-success" role="alert">
                <span>${sessionScope.msg1}</span>
                <c:remove var="msg1" scope="session"></c:remove>
            </div>
        </c:if>
        <c:if test="${sessionScope.msg0 != null}">
            <div class="alert alert-danger" role="alert">
                <span>${sessionScope.msg0}</span>
                <c:remove var="msg0" scope="session"></c:remove>
            </div>
        </c:if>


        <table class="table table-bordered">
            <thead id="header">
            <tr>
                <th>账单编码</th>
                <th>商品名称</th>
                <th>商品描述</th>
                <th>商品单位</th>
                <th>商品数量</th>
                <th>商品总额</th>
                <th>是否支付</th>
                <th>供应商</th>
                <th>操作</th>
            </tr>
            </thead>
            <tbody id="content">
            <c:forEach var="bill" items="${bills}">
                <tr>
                    <td><span>${bill.billCode}</span></td>
                    <td><span>${bill.productName}</span></td>
                    <td><span>${bill.productDesc}</span></td>
                    <td><span>${bill.productUnit}</span></td>
                    <td><span>${bill.productCount}</span></td>
                    <td><span>${bill.totalPrice}</span></td>
                    <td>
                                <span>
								<c:if test="${bill.isPayment==1}">未支付</c:if>
								<c:if test="${bill.isPayment==2}">已支付</c:if>
							    </span>
                    </td>
                    <td><span>${bill.proName}</span></td>
                    <td>
                        <div class="btn-group" role="group" aria-label="Basic example">
                            <a type="button" class="btn btn-primary" href="/reachBill?billId=${bill.id}">修改</a>
                            <a type="button" class="btn btn-primary" href="/deleteBill?id=${bill.id}">删除</a>
                        </div>
                    </td>
                </tr>
            </c:forEach>
            </tbody>
        </table>
    </div>
    <div class="page-bar">
        <ul class="nav">
            <li class="nav-item">
                <a class="nav-link disabled">共${totalCount}条记录&nbsp;&nbsp; ${currentPageNo }/<span id="totalPageCount">${totalPageCount}页</span></a>
            </li>
            <c:if test="${currentPageNo > 1}">
                <li class="nav-item">
                    <a class="nav-link active" href="javascript:page_nav(document.forms[0],1);">首页</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="javascript:page_nav(document.forms[0],${currentPageNo-1});">上一页</a>
                </li>
            </c:if>
            <c:if test="${currentPageNo < totalPageCount }">
                <li class="nav-item">
                    <a class="nav-link" href="javascript:page_nav(document.forms[0],${currentPageNo+1 });">下一页</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="javascript:page_nav(document.forms[0],${totalPageCount });">尾页</a>
                </li>
            </c:if>
            <div class="form-inline my-2 my-lg-0">
                <input class="form-control mr-sm-2 page-key" name="inputPage" id="inputPage" type="text"  placeholder="Search" >
                <a type="button" class="btn btn-outline-warning my-2 my-sm-0 page-btn" onClick='jump_to(document.forms[0],document.getElementById("inputPage").value)'>GO</a>
            </div>
        </ul>
    </div>
</main>
</div>
</div>
</body>
<script>
    function page_nav(frm,num){
        frm.pageIndex.value = num;
        frm.submit();
    }
    function jump_to(frm,num){
        //alert(num);
        //验证用户的输入
        var regexp=/^[1-9]\d*$/;
        var totalPageCount = document.getElementById("totalPageCount").value;
        //alert(totalPageCount);
        if(!regexp.test(num)){
            alert("请输入大于0的正整数！");
            return false;
        }else if((num-totalPageCount) > 0){
            alert("请输入小于总页数的页码");
            return false;
        }else{
            page_nav(frm,num);
        }
    }
</script>
</html>
